এইচটিএমএল ডোম জাভাস্ক্রিপ্টের মাধ্যমে এইচটিএমএল এলিমেন্টের কন্টেন্টকে পরিবর্তন করতে সাহায্য করে।
জাভাস্ক্রিপ্ট খুব সহজে একটি ডায়নামিক এইচটিএমএল কন্টেন্ট তৈরি করতে পারেঃ
তারিখঃ Wed Aug 23 2023 03:13:58 GMT+0600 (Bangladesh Standard Time)
জাভাস্ক্রিপ্টে document.write() দ্বারা সরাসরি এইচটিএমএলে আউটপুট নেওয়া যায়ঃ
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p>তারিখ প্রদর্শনঃ</p>
<script>
document.write(Date());
</script>
</body>
</html>
তবে ডকুমেন্ট লোড হয়ে যাওয়ার পর document.write() ব্যবহার করা ঠিক নয়। এটি ডকুমেন্টটিকে সম্পূর্ণ পরিবর্তন করে।
একটি এইচটিএমএল এলিমেন্টের কন্টেন্ট পরিবর্তন করার সবচেয়ে সহজ উপায় হলো innerHTML প্রোপার্টি ব্যবহার করা।
এইচটিএমএল এলিমেন্টের কন্টেন্ট পরিবর্তন করার জন্য নিচের এই সিন্টেক্স ব্যবহার করুনঃ
document.getElementById(id).innerHTML = new HTML
নিচের উদাহরণে একটি <p> এলিমেন্টের কন্টেন্টকে পরিবর্তন করা হয়েছেঃ
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p id="para">স্যাট একাডেমী</p>
<script>
document.getElementById("para").innerHTML = "নতুন টেক্সট!";
</script>
</body>
</html>
নিচের উদাহরণে একটি <h3> এলিমেন্টের কন্টেন্টকে পরিবর্তন করা হয়েছেঃ
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<h3 id="heading">স্যাট একাডেমী</h3>
<script>
document.getElementById("heading").innerHTML = "নতুন হেডিং!";
</script>
</body>
</html>
উদাহরণের ব্যাখ্যাঃ
এইচটিএমএল এট্রিবিউটের ভ্যালু পরিবর্তন করার জন্য নিচের সিন্টেক্স ব্যবহার করুনঃ
document.getElementById(id).attribute = new value
নিচের উদাহরণে <a> এলিমেন্টের href এট্রিবিউটের ভ্যালু পরিবর্তন করা হয়েছেঃ
kt_satt_skill_example_id=1418
উদাহরণের ব্যাখ্যাঃ
Read more
or
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
